import Link from './components/link'
import View from './components/view'

export let _Vue;  // 导出Vue 方便其他文件使用
export default function install(Vue) {
  // 插件安装的入口
  _Vue = Vue;

  Vue.mixin({
    beforeCreate() {
      // 将父亲传入的router实例共享给所有的子组件
      if(this.$options.router) {  // 根组件逻辑
        this._routerRoot = this //为每个实例添加根实例
        this._router = this.$options.router
        this._router.init(this) // 这里的this就是根实例

        // 如何获取到current属性
        Vue.util.defineReactive(this, '_route', this._router.history.current)
        this._router.history.current

      } else {  // 子组件逻辑
        // 组件渲染是层层渲染的
        this._routerRoot = this.$parent && this.$parent._routerRoot
      }
      
      // 无论是父组件还是子组件 都可以通过 this._routerRoot.router获取共同的实例
    }
  })

  // 插件一般用于定义全局组件 全局指令 过滤器 原型方法

  Vue.component('router-link', Link)

  Vue.component('router-view', View)

  // $route代表路由中所有的属性
  Object.defineProperty(Vue.prototype, '$route', {
    get() {
      return this._routerRoot._route
    }
  })

  // $router存放路由相关的所有方法
  Object.defineProperty(Vue.prototype, '$router', {
    get() {
      return this._routerRoot._router
    }
  })
}